<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>订单详情</title>
    <%--    <link rel="stylesheet" href="css/globe.css">--%>
    <link rel="stylesheet" href="css/dish_detail.css">
    <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="js/getParameter.js"></script>
    <script>
        $(function () {
            var dishId = getParameter("dishId");
            loadDishById(dishId);

            $("#minusBtn").click(function () {
                var count = $("#quantity_input").val();
                count--;
                if (count < 1) {
                    alert("数量低于范围");
                } else {
                    $("#quantity_input").val(count);
                    if (count === 1) {
                        $("#minusBtn").css("color", "#ccc");
                        $("#minusBtn").css("cursor", "not-allowed");
                    }
                    if (count !== 99) {
                        $("#addBtn").css("color", "#666");
                        $("#addBtn").css("cursor", "pointer");
                    }
                }
            });

            $("#addBtn").click(function () {
                var count = $("#quantity_input").val();
                count++;
                if (count > 99) {
                    alert("不能再加了");
                } else {
                    $("#quantity_input").val(count);
                    if (count !== 1) {
                        $("#minusBtn").css("color", "#666");
                        $("#minusBtn").css("cursor", "pointer");
                    }
                    if (count !== 99) {
                        $("#addBtn").css("color", "#666");
                        $("#addBtn").css("cursor", "#pointer");
                    } else if (count === 99) {
                        $("#addBtn").css("color", "#ccc");
                        $("#addBtn").css("cursor", "not-allowed");
                    }
                }
            });

            $("#quantity_input").on("input", function () {
                var count = $("#quantity_input").val();
                var reg = /^\d{0,3}$/;
                if (reg.test(count)) {
                    if (count <= 1) {
                        count = 1;
                        $("#minusBtn").css("color", "#ccc");
                        $("#minusBtn").css("cursor", "not-allowed");
                    } else if (count > 99) {
                        count = 99;
                        $("#addBtn").css("color", "#ccc");
                        $("#addBtn").css("cursor", "not-allowed");
                        alert("不能再加了");
                    } else if (count == 99) {
                        $("#addBtn").css("color", "#ccc");
                        $("#addBtn").css("cursor", "not-allowed");
                    } else {
                        $("#minusBtn").css("color", "#666");
                        $("#minusBtn").css("cursor", "pointer");
                        $("#addBtn").css("color", "#666");
                        $("#addBtn").css("cursor", "pointer");
                    }
                } else {
                    count = 1;
                    $("#minusBtn").css("color", "#ccc");
                    $("#minusBtn").css("cursor", "not-allowed");
                }
                $("#quantity_input").val(count);
            });

            $("#add_cart").click(function () {
                var userId = '<%=session.getAttribute("userId")%>';
                if (userId !== "null" && userId.length > 0) {
                    var count = $("#quantity_input").val();
                    addCart(userId, dishId, count);
                } else {
                    alert("您还未登录，请登录");
                    window.location.href = "${pageContext.request.contextPath}/login.jsp";
                }
            });

        });

        function loadDishById(dishId) {
            $.ajax({
                url: "${pageContext.request.contextPath}/dish/findDishById",
                type: "get",
                dataType: "json",
                data: {
                    dishId: dishId
                },
                success: function (data) {
                    if (data.flag) {
                        var dish = data.data;
                        $("#info_img").attr("src", dish.imagesRoute);
                        $("#dish_name").text(dish.dishName);
                        $("#dish_price").html('&yen;' + dish.dishPrice);
                        $("#dish_description").text("描述：" + dish.description);
                    } else {
                        alert(data.infoMsg);
                    }
                },
                error: function () {
                    alert("发送失败");
                }
            });
        }

        function addCart(userId, dishId, count) {
            $.ajax({
                url: "${pageContext.request.contextPath}/cart/editCart",
                type: "post",
                dataType: "json",
                data: {
                    userId: userId,
                    dishId: dishId,
                    count: count
                },
                success: function (data) {
                    if (data.flag) {
                        alert("加入购物车成功！")
                    } else {
                        alert("加入购物车失败！")
                    }
                },
                error: function () {
                    alert("发送失败");
                }
            });
        }
    </script>
</head>
<body>
<jsp:include page="user_bar.jsp"/>
<div id="main_page">
    <div class="back_link">
        <a href="javascript:history.back(-1);">&lt;返回</a>
    </div>

    <div class="dish_out_div clearfix">
        <div class="dish_img">
            <img src="" alt="" id="info_img"/>
        </div>
        <div class="dish_info">
            <p id="dish_name"></p>
            <p id="dish_price"></p>
            <p id="dish_description"></p>
            <div class="count_wrapper clearfix">
                <div class="quantity_btn minusBtn" id="minusBtn">
                    <span>-</span>
                </div>
                <div class="count_value">
                    <input id="quantity_input" value="1">
                </div>
                <div class="quantity_btn addBtn" id="addBtn">
                    <span>+</span>
                </div>
            </div>
            <div class="action_btn">
                <button id="add_cart">
                    <span>加入购物车</span>
                </button>
            </div>
        </div>

    </div>
</div>

</body>
</html>
